<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>东北药用植物种质资源保存信息网</title>
    <link rel="shortcut icon " href="js/plant.png">
    <script src="js/jquery-3.5.1.min.js"></script>
    <script src="js/vue.js"></script>
    <link href="js/css/bootstrap.min.css" rel="stylesheet" type="text/css">
    <script src="js/js/bootstrap.min.js"></script>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    <style>
        #show {
            width: auto; /*宽度设置固定值*/
            margin: 10px auto;
            height: auto;
            vertical-align: middle;
        }

        table {
            float: left;
            text-align: center;
        }
    </style>

</head>
<body>
<section id="show" style="margin-left: 10%;margin-top: 5%">
    资源：<input type="file" name="file" value="导入Excel" @change="fileResolving($event)">
    <!--    图片(最多三张)：<input id="img" type="file" multiple="multiple" @change="imageResolving($event)"/>-->
    <button type="button" class="btn btn-success btn-sm" @click="fileUpload()">提交</button>
</section>
</body>
<script type="text/javascript">
    var index1 = 0;
    Array.prototype.removeByValue = function (val, v1, v2, v3) {
        for (var i = 0; i < this.length; i++) {
            if (this[i] == val || this[i] == v1 || this[i] == v2 || this[i] == v3) {
                index1++;
                this.splice(i, 1)
                break
            }
        }
    }
    const x = new Vue({
        el: '#show',
        data: {
            plantList: '',
            nameList: '',
            imageList: [],
            selected: '资源编号',
            textVal: ''
        },
        methods: {
            fileResolving(e) {
                var file = e.target.files[0]
                var self = this
                self.file = file
            //     let param = new FormData()
            //     param.append('file', file)
            //     let config = {
            //         headers: {'Content-Type': 'multipart/form-data'}
            //     }
            //     axios.post('http://localhost:8080/import/excelResolving', param, config)
            //         .then(res => {
            //             alert("成功上传"+res.data+"个")
            //             // alert(res.data)
            //             // this.plantList = res.data
            //             // this.nameList = Object.keys(this.plantList)
            //             // this.plantList['记录地址'] = this.plantList['种质名称'] + "-" + window.location.href
            //             // this.plantList['源数据主键'] = '详细信息->'
            //         })
            },
            // imageResolving(e) {
            //     var files = e.target.files
            //     if (files.length > 3) {
            //         alert("上传失败，一次最多上传3张")
            //         return
            //     }
            //     this.imageList = files
            // },
            fileUpload(index) {
                let param = new FormData()
                param.append('file', this.file)
                if (this.imageList.length > 0) {
                    for (let index = 0; index < this.imageList.length; index++) {
                        const element = this.imageList[index];
                        param.append("imageList", element);
                    }
                }
                let config = {
                    headers: {'Content-Type': 'multipart/form-data'}
                }
                axios.post('http://8.130.8.204:8080/plant/import/importExcel', param, config)
                    .then(res => {
                        alert("成功上传" + res.data + "个")
                        location.reload()
                    })
            }
        },
        computed: {
            sliceList() {
                return function (data, count) {
                    data.removeByValue("id", "ophoto", "tphoto", "fphoto")
                    if (data != undefined) {
                        let index = 0;
                        let arrTemp = [];
                        for (let i = 0; i < data.length; i++) {
                            index = parseInt(i / count);
                            if (arrTemp.length <= index) {
                                arrTemp.push([]);
                            }
                            arrTemp[index].push(data[i])

                            if (data[i] == '源数据主键') {
                                break
                            }
                        }
                        return arrTemp
                    }
                }
            }
        }
    })
</script>
</html>